<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <h1 id="aa"></h1>
    <button onclick="abc()">发送ajax</button>
    <script>

        var xhr = new XMLHttpRequest()

        function abc() {

            xhr.open('get', 'https://www.fastmock.site/mock/ed95e4b607f3acb7ca765c9a0283c571/api/goods/all')

            xhr.send()

            // 回调监听
            xhr.onreadystatechange = function(){

                if (xhr.readyState == 4) { // 对象xmlhttprequest对象 接收成功
                    if (xhr.status == 200) { // http状态200正常 404找不到资源
                        console.info(xhr.responseText)
                        let data = Json.parse(xhr.responseText)
                        document.getElementById("aa").innerHTML = data.data.length
                    }
                }

            }


        }

    </script>
</body>
</html>